<template>
	<!-- 价格明细 -->
	<view class="container">
		<view class="top">
			<view class="price">
				￥{{price}}
			</view>
			<!-- <view class="licheng">
				(总里程10公里)
			</view> -->
			<view class="tips">
				若产生其他费用，请与司机按收费标准结算
			</view>
		</view>
		<view class="bottom">
			<view class="item">
				<image src="../../static/icon/cheliang.png" mode=""></image>
				<view class="title">
					起步价
				</view>
				<view class="jiage" v-if="type==1">
					￥{{info.hoisting_min}}
				</view>
				<view class="jiage" v-if="type==2">
					￥{{info.road_min}}
				</view>
				<view class="jiage" v-if="type==3">
					￥{{info.welkin_min}}
				</view>
			</view>
			<view class="item" v-if="type==1">
				<image src="../../static/icon/licheng.png" mode=""></image>
				<view class="title">
					里程({{distance/1000}}公里)
				</view>
				<view class="jiage">
					￥{{(disPriceD*1).toFixed(2)}}
				</view>
			</view>
			<view class="item" v-if="type==1">
				<image src="../../static/icon/licheng.png" mode=""></image>
				<view class="title">
					时长({{duration_at}}分钟)
				</view>
				<view class="jiage">
					￥{{(timePriceD*1).toFixed(2)}}
				</view>
			</view>
			<view class="item" v-if="type==2">
				<image src="../../static/icon/licheng.png" mode=""></image>
				<view class="title">
					里程({{distance/1000}}公里)
				</view>
				<view class="jiage">
					￥{{(disPriceD*1).toFixed(2)}}
				</view>
			</view>
			<view class="item" v-if="type==3">
				<image src="../../static/icon/licheng.png" mode=""></image>
				<view class="title">
					时长({{duration_at}}分钟)
				</view>
				<view class="jiage">
					￥{{(timePriceWelkin*1).toFixed(2)}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				price:0,
				info:'',
				type:1,
				distance:0,//距离
				disPriceD:0,//调运里程价格
				timePriceD:0,//吊运时长价格
				duration_at:0,//时长
				disPriceRoad:0,//道路救援距离单价
				timePriceWelkin:0//高空作业价格
			};
		},
		onLoad(e) {
			// console.log(e)
			this.info= JSON.parse(e.charge)
			this.type=e.type
			this.distance=e.distance
			this.disPriceD=e.disPriceD
			this.timePriceD=e.timePriceD
			this.duration_at=e.duration_at
			this.disPriceRoad=e.disPriceRoad
			this.timePriceWelkin=e.timePriceWelkin
			if(e.type==1){
				if(e.price>JSON.parse(e.charge).hoisting_min){
					this.price=(e.price*1).toFixed(2)
				}else{
					this.price=JSON.parse(e.charge).hoisting_min
				}
			}else if(e.type==2){
				if(e.price>JSON.parse(e.charge).road_min){
					this.price=(e.price*1).toFixed(2)
				}else{
					this.price=JSON.parse(e.charge).road_min
				}
			}else if(e.type==3){
				if(e.price>JSON.parse(e.charge).welkin_min){
					this.price=(e.price*1).toFixed(2)
				}else{
					this.price=JSON.parse(e.charge).welkin_min
				}
			}
			// console.log(this.info)
		}
	}
</script>

<style lang="scss" scoped>
	.container{
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background: #F2F2F2;
		.top{
			background: #FFFFFF;
			width:100%;
			height:290upx;
			background:rgba(255,255,255,1);
			border-radius:0upx 0upx 40upx 40upx;
			text-align: center;
			overflow: hidden;
			.price{
				margin-top: 50upx;
				line-height: 60upx;
				font-size:60upx;
				font-family:Microsoft YaHei;
				font-weight:bold;
				color:rgba(255,62,62,1);
			}
			.licheng{
				line-height: 30upx;
				margin-top: 20upx;
				font-size:30upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(52,52,52,1);
			}
			.tips{
				font-size:30upx;
				line-height: 30upx;
				margin-top: 20upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(52,52,52,1)
			}
		}
		.bottom{
			background:rgba(255,255,255,1);
			border-radius:40upx 40upx 30upx 30upx;
			margin-top: 20upx;
			.item{
				margin: 0 30upx;
				border-bottom: 2upx solid #EDEDED;
				display: flex;
				image{
					width: 50upx;
					height: 50upx;
					margin: 28upx 8upx;
				}
				.title{
					font-size:30upx;
					line-height: 102upx;
					margin-left: 8upx;
					font-family:Microsoft YaHei;
					font-weight:400;
					color:rgba(52,52,52,1);
				}
				.jiage{
					font-size:30upx;
					font-family:Microsoft YaHei;
					font-weight:bold;
					color:rgba(255,62,62,1);
					line-height: 102upx;
					position: absolute;
					right: 50upx;
				}
			}
		}
	}
</style>
